<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Applications</title>
        <script src="https://cdn.jsdelivr.net/gh/MarketingPipeline/Emoji-Parser/version/1.0.0/dist/emoji_parser.min.js"></script>
        <link href="{% static 'css/app-card.css' %}" rel="stylesheet">
        <link href="{% static 'css/font-family.css' %}" rel="stylesheet">
        <link href="{% static 'css/applications.css' %}" rel="stylesheet">
        <link href="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/css/bootstrap.min.css" rel="stylesheet">
        <link href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
        <link href="https://lib.baomitu.com/boxicons/latest/css/boxicons.min.css" rel="stylesheet">
    </head>
    <body>
        <section class="app-container">
            {% for template in templates %}
                <div class="box">
                <span></span>
                <h2 class="index poppins">{{ template.index }}</h2>
                    <div class="content">
                        {% if template.image %}
                            <img src="{{ template.image }}" alt>
                        {% endif %}
                        <h2>{{ template.name }}</h2>
                        <p>{{ template.profile|safe }}</p>
                        <a href="{{ template.path }}">
                            <div class="start-btn poppins"> Get started<div class="icon"><i class='bx bx-right-arrow-alt'></i></div></div>
                        </a>
                        <hr>
                        <p class="author">author: {{ template.author }}</p>
                        {% for url in template.info_urls %} <img src="{{ url }}" alt> {% endfor %}
                        {% if template.info_urls %} <br> {% endif %}
                        {% for repo, addr in template.repository_address.items %}
                            <a href="{{ addr }}" target="_blank" class="repo"><i class="fa fa-{{ repo }}"></i></a>
                        {% endfor %}
                    </div>
                </div>
            {% endfor %}
        </section>
    </body>
</html>